<template>
    <div class="container">
        <div class="demo">
            <div class="demo-title">Props</div>
            <table border="1">
                <thead>
                    <tr>
                        <td>参数</td>
                        <td>说明</td>
                        <td>类型</td>
                        <td>默认值</td>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>autoUpload</td>
                        <td>选择完成之后是否自动上传</td>
                        <td>Boolean</td>
                        <td>false</td>
                    </tr>
                    <tr>
                        <td>length</td>
                        <td>可选的个数</td>
                        <td>Number</td>
                        <td>0</td>
                    </tr>
                    <tr>
                        <td>accept</td>
                        <td>可选的文件类型</td>
                        <td>String</td>
                        <td>*</td>
                    </tr>
                    <tr>
                        <td>list</td>
                        <td>默认值</td>
                        <td>Array</td>
                        <td>[]</td>
                    </tr>
                </tbody>
            </table>

            <div class="demo-title">Events</div>
            <table border="1">
                <thead>
                    <tr>
                        <td>事件</td>
                        <td>说明</td>
                        <td>回调参数</td>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>clickItem</td>
                        <td>点击图片事件</td>
                        <td>返回图片的数据和index</td>
                    </tr>
                    <tr>
                        <td>change</td>
                        <td>图片数据有变化事件</td>
                        <td>图片压缩、图片上次成功都会返回</td>
                    </tr>
                </tbody>
            </table>

            <brsUploader @change="changeHandle" @clickItem="clickItem"></brsUploader>
        </div>
    </div>
</template>

<script>
import brsUploader from "@/components/uploader"
export default {
    name: 'demo-uploader',
    components: { brsUploader },
    methods: {
        changeHandle(e){
            console.log('changeHandle', e)
        },
        clickItem(e){
            console.log('clickItem', e)
        }
    }
}
</script>

<style lang="less" scoped>

</style>